<template>
    <div class="link-preview">
        <div class="link-preview-header">
            <div class="link-preview-url">{{ url }}</div>
        </div>
    </div>
</template>
<script setup>
//实现链接预览
import { ref, watch, onMounted } from 'vue'
const title = ref('')

defineProps({
    url: { type: String, default: '' }
})








</script>

<style lang="scss" scoped>
.link-preview {
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
}
.link-preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    .link-preview-title {
        font-size: 16px;
        font-weight: 500;
    }
    .link-preview-url {
        font-size: 14px;
        color: #999;
        overflow: hidden;
        text-align: left;
        cursor: pointer;
    }
    .link-preview-content {
        font-size: 14px;
        color: #999;
    }
}
</style>
